<!DOCTYPE html>
<html lang="en">

<head>

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">

<title>SB Admin 2 - Bootstrap Admin Theme</title>

<!-- Bootstrap Core CSS -->
<link href="../bower_components/bootstrap/dist/css/bootstrap.min.css"
	rel="stylesheet">

<!-- MetisMenu CSS -->
<link href="../bower_components/metisMenu/dist/metisMenu.min.css"
	rel="stylesheet">

<!-- Timeline CSS -->
<link href="../dist/css/timeline.css" rel="stylesheet">

<!-- Custom CSS -->
<link href="../dist/css/sb-admin-2.css" rel="stylesheet">

<!-- Morris Charts CSS -->
<link href="../bower_components/morrisjs/morris.css" rel="stylesheet">

<!-- Custom Fonts -->
<link href="../bower_components/font-awesome/css/font-awesome.min.css"
	rel="stylesheet" type="text/css">
<!-- DataTables CSS -->
<link
	href="../bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css"
	rel="stylesheet">

<!-- DataTables Responsive CSS -->
<link
	href="../bower_components/datatables-responsive/css/dataTables.responsive.css"
	rel="stylesheet">

<!-- jQuery -->
<script src="../bower_components/jquery/dist/jquery.min.js"></script>

<!-- Bootstrap Core JavaScript -->
<script src="../bower_components/bootstrap/dist/js/bootstrap.min.js"></script>

<!-- Metis Menu Plugin JavaScript -->
<script src="../bower_components/metisMenu/dist/metisMenu.min.js"></script>

<!-- DataTables JavaScript -->
<script
	src="../bower_components/datatables/media/js/jquery.dataTables.min.js"></script>
<script
	src="../bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js"></script>

<script type="text/javascript" src="../js/bootstrap-paginator.js"></script>

<!-- 显示列表 -->
<script type="text/javascript" src="../js/show-list.js"></script>

<!-- 显示列表 -->
<script type="text/javascript" src="../js/pets-add.js"></script>

<!-- Custom Theme JavaScript -->
<script src="../dist/js/sb-admin-2.js"></script>


<script type="text/javascript" src="../js/show-modals.js"></script>

<script type="text/javascript" src="../js/pet-show.js"></script>




</head>

<body>

	<div id="wrapper">


		<!-- Navigation -->
		<nav class="navbar navbar-default navbar-static-top" role="navigation"
			style="margin-bottom: 0">
			<div class="navbar-header">
				<button type="button" class="navbar-toggle" data-toggle="collapse"
					data-target=".navbar-collapse">
					<span class="sr-only">Toggle navigation</span> <span
						class="icon-bar"></span> <span class="icon-bar"></span> <span
						class="icon-bar"></span>
				</button>
				<a class="navbar-brand" href="index.html">Happy Pet后台管理</a>
			</div>
			<!-- /.navbar-header -->
			<ul class="nav navbar-top-links navbar-right">


				<li class="dropdown"><a class="dropdown-toggle"
					data-toggle="dropdown" href="#"> <i class="fa fa-bell fa-fw"></i>
				</a></li>
				<!-- /.dropdown -->
				<li class="dropdown">
				<a class="dropdown-toggle"
					data-toggle="dropdown" href="#"> <i class="fa fa-user fa-fw"></i>
				</a>
				<ul class="dropdown-menu dropdown-user">
                            <li><a href="manager.html"><i class="fa fa-gear fa-fw"></i> 设置</a>
                            </li>
                            <li class="divider"></li>
                            <li ><a href="../../BLogout"><i class="fa fa-sign-out fa-fw"></i> 退出</a>
                            </li>
                  </ul>
				</li>
				<!-- /.dropdown -->
			</ul>
			<!-- /.navbar-top-links -->

			<div class="navbar-default sidebar" role="navigation">
				<div class="sidebar-nav navbar-collapse">
					<ul class="nav" id="side-menu">

						<li><a href="index.html"><i class="fa fa-dashboard fa-fw"></i> 主页</a>
						</li>

						<li class="power-1"><a href="#"><i class="fa fa-edit fa-fw"></i> 宠物管理<span
								class="fa arrow"></span></a>

							<ul class="nav nav-second-level" id="pets-manager-list">


							</ul> <!-- /.nav-second-level --></li>

						<li class="power-2"><a href="#"><i class="fa fa-dashboard fa-fw"></i>
								业务处理<span class="fa arrow"></span></a>
							<ul class="nav nav-second-level">
								<li><a href="deal.html#2">订单处理</a></li>
							</ul> <!-- /.nav-second-level --></li>

						<li class="power-3"><a href="#"><i class="fa fa-bar-chart-o fa-fw"></i>
								营业分析<span class="fa arrow"></span></a>
							<ul class="nav nav-second-level">
								<li><a href="stats.html#1">收支查询及统计</a></li>
							</ul> <!-- /.nav-second-level --></li>

						<li class="power-4"><a href="user.html"><i class="fa fa-sitemap fa-fw"></i>
								会员管理</a></li>

						<li class="power-5"><a href="manager.html"><i class="fa fa-wrench fa-fw"></i>
								员工管理</a></li>




					</ul>
				</div>
				<!-- /.sidebar-collapse -->
			</div>
			<!-- /.navbar-static-side -->
		</nav>




		<!-- Page Content -->
		<div id="page-wrapper">
			<div class="container-fluid">
				<div class="row">

					<!-- <h1 class="page-header">Blank</h1> -->

					<!-- -------------------------------------------------- -->

					<div class="col-lg-12">
						<div class="panel panel-default">
							<div class="panel-heading">
								宠物信息
								<div class="pull-right">
									<button data-toggle="modal" data-target="#petAddModal"
										class="add-pet-btn btn btn-primary btn-sm">添加</button>
								</div>
							</div>
							<!-- /.panel-heading -->
							<div class="panel-body">
								<div class="table-responsive">
									<table class="table table-striped table-bordered table-hover">
										<thead>
											<tr>
												<th>ID</th>
												<th>品种</th>
												<th>名称</th>
												<th>性别</th>
												<th>颜色</th>
												<th>上架</th>
												<th>操作</th>
											</tr>
										</thead>
										<tbody>
											<tr>
												<td>Trident</td>
												<td>Internet Explorer 4.0</td>
												<td>Win 95+</td>
												<td class="center">4</td>
												<td class="center">4</td>
												<td class="center">4</td>
												<td class="center">
													<div class="btn-group" data-pet-id="1">
														<button type="button" class="btn btn-default"
															id="petInfoBtn">详细信息</button>
														<button type="button" class="btn btn-default"
															id="petUpdateBtn">修改</button>
														<button type="button" class="btn btn-default"
															id="delPetBtn">删除</button>
													</div>
												</td>
											</tr>
											<tr>
												<td>2</td>
												<td>Jacob</td>
												<td>Thornton</td>
												<td>@fat</td>
												<td>2</td>
												<td>Jacob</td>
												<td>Thornton</td>
											</tr>
											<tr>
												<td>3</td>
												<td>Larry</td>
												<td>the Bird</td>
												<td>@twitter</td>
												<td>2</td>
												<td>Jacob</td>
												<td>Thornton</td>
											</tr>
										</tbody>
									</table>
									<div id="example" style="text-align: center">
										<ul id="pageLimit"></ul>
									</div>
								</div>
								<!-- /.table-responsive -->

								<!-- ============ -->





								<!-- ============ -->
							</div>
							<!-- /.panel-body -->
						</div>
						<!-- /.panel -->
					</div>

					<!-- -------------------------------------------------- -->


				</div>

				<!-- col - lg -6 -->

				<!-- col - lg -6 -->
			</div>
			<!-- /.row -->
		</div>
		<!-- /.container-fluid -->
	</div>
	<!-- /#page-wrapper -->

	</div>
	<!-- /#wrapper -->



	<!-- Page-Level Demo Scripts - Tables - Use for reference -->
	<script>
		$(document).ready(function() {
			$('#dataTables-example').DataTable({
				responsive : true
			});
		});
	</script>




	<!-- 修改模态框（Modal） -->
	<div class="modal fade" id="petInfoModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">查看/修改</h4>
				</div>
				<div class="modal-body">

					<ul id="myTab" class="nav nav-tabs">
						<li class="active"><a href="#home" data-toggle="tab">
								查看/修改 </a></li>
						<li><a href="#ios" data-toggle="tab">修改图片</a></li>
					</ul>
					<div id="myTabContent" class="tab-content">


						<div class="tab-pane fade in active" id="home">



							<!-- ======================================================================== -->

							<form class="form-horizontal" role="form" id="pet-info-form"
								method="post" action="../../PetDeal?flag=2"
								enctype="multipart/form-data">
								<div class="form-group">
									<label for="firstname" class="col-sm-2 control-label">编号</label>
									<div class="col-sm-10">
										<input type="text" class="form-control" name="pet-id"
											disabled="disabled" value="1" id="info-pet-id">
										
										<input type="text" class="form-control" name="pet-id"
											style="display:none" value="1" id="info-pet-id">
										
									</div>
								</div>
								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">名称</label>
									<div class="col-sm-10">
										<input type="text" class="form-control" name="pet-name"
											id="info-pet-name" value="">
									</div>
								</div>

								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">昵称</label>
									<div class="col-sm-10">
										<input type="text" class="form-control" id="info-pet-nickname"
											name="pet-nickname" value="">
									</div>
								</div>

								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">性别</label>
									<div class="col-sm-10">
										<input type="radio" id="info-pet-sex-1" name="pet-sex"
											value="雄">雄 <input type="radio" id="info-pet-sex-2"
											name="pet-sex" value="雌">雌
									</div>
								</div>
								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">种类</label>
									<div class="col-sm-10">
										<select class="up-big-category" name="pet-bigcategory">狗
										</select> <select class="up-small-category" name="pet-smallcategory">藏獒
										</select>
									</div>
								</div>
								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">年龄</label>
									<div class="col-sm-10">
										<input type="text" class="form-control" name="pet-age"
											id="info-pet-age" value="">
									</div>
									<div class="form-group">
										<label for="lastname" class="col-sm-2 control-label">介绍</label>
										<div class="col-sm-10">
											<textarea class="form-control" rows="3"
												id="info-pet-introduce" name="pet-introduce"></textarea>
										</div>
									</div>
								</div>
								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">体型</label>
									<div class="col-sm-10">
										<!-- 根据 -->
										<select class="pet-shape" name="pet-shape">
											<option value="大型">大型</option>
											<option value="中型">中型</option>
											<option value="小型">小型</option>
										</select>
									</div>
								</div>

								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">体重(kg)</label>
									<div class="col-sm-10">
										<input type="text" class="form-control" name="pet-weight"
											id="info-pet-weight" value="">
									</div>
								</div>

								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">颜色</label>
									<div class="col-sm-10">
										<input type="text" class="form-control" name="pet-color"
											id="info-pet-color" value="">
									</div>
								</div>

								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">进价</label>
									<div class="col-sm-10">
										<input type="text" class="form-control"
											id="info-pet-costprice" name="pet-costprice" value="">
									</div>
								</div>

								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">数量</label>
									<div class="col-sm-10">
										<input type="text" class="form-control" name="pet-count"
											id="info-pet-count" disabled="disabled"value="1">
									</div>
								</div>

								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">产地</label>
									<div class="col-sm-10">
										<input type="text" class="form-control" name="pet-address"
											id="info-pet-address" value="">
									</div>
								</div>

								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">售价</label>
									<div class="col-sm-10">
										<input type="text" class="form-control" id="info-pet-price"
											name="pet-price" value="">
									</div>
								</div>

								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">特价</label>
									<div class="col-sm-10">
										<input type="text" class="form-control" id="info-pet-specialprice"
											name="pet-specialprice" value="">
									</div>
								</div>

								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">上架时间</label>
									<div class="col-sm-10">
										<input type="text" class="form-control" id="info-pet-date"
											name="pet-date" disabled="disabled"value="">
									</div>
								</div>

								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">是否特价</label>
									<div class="col-sm-10">
										<input type="radio" id="info-pet-mark-1" name="pet-mark"
											value="1">是 <input type="radio" id="info-pet-mark-0"
											name="pet-mark" value="0">否
									</div>
								</div>

								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">是否上架</label>
									<div class="col-sm-10">
										<input type="radio" id="info-pet-state-1" name="pet-state"
											value="1">是 <input type="radio" id="info-pet-state-0"
											name="pet-state" value="0">否
									</div>
								</div>

								<div class="form-group">
									<div class="col-sm-10">
										<button class="btn btn-lg btn-primary" id="info-btn"
											>确定</button>
									</div>
								</div>

								<!-- form end -->
							</form>

							<!-- ======================================================================= -->
						</div>

						<div class="tab-pane fade" id="ios">
							<h3>图片(3张必填)</h3>

							<form id="up-img-form" method="post"
								action="../../PetDeal?flag=3" enctype="multipart/form-data">
								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">图1</label>
									<label><img class="img-thumbnail" alt="" id="info-pet-image01" src=""></label>
									<div class="col-sm-10">
										<input type="text" name="pet-id" class="form-control"
											id="img-pet-id" style="display: none" value=""> <input
											type="file" name="pet-image01" class="form-control"
											 value="">
									</div>
								</div>

								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">图2</label>
									<label><img alt="" class="img-thumbnail"  id="info-pet-image02" src=""></label>
									<div class="col-sm-10">

										<input type="file" name="pet-image02" class="form-control"
											 value="">
									</div>
								</div>

								<div class="form-group">
									<label for="lastname" class="col-sm-2 control-label">图3</label>
									<label><img alt="" class="img-thumbnail"  id="info-pet-image03" class="" src=""></label>
									<div class="col-sm-10">

										<input type="file" name="pet-image03" class="form-control"
											 value="">
									</div>
								</div>

								<div class="form-group">
									<div class="col-sm-2">
										<button class="btn btn-lg btn-primary" id="img-btn" value="">确定</button>
									</div>
								</div>

							</form>
						</div>
					</div>

				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-lg" data-dismiss="modal">关闭
					</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal -->
	</div>

	<!-- ========================================================================================================= -->

	<!-- 添加模态框（Modal） -->
	<div class="modal fade" id="petAddModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true"
		data-backdrop="false">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">添加</h4>
				</div>
				<div class="modal-body">

					<!-- ===================================================================== -->

					<form class="form-horizontal" role="form" id="pet-add-form"
						method="post" action="../../PetDeal?flag=1"
						enctype="multipart/form-data">
						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">名称</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="add-pet-name"
									name="pet-name" value="">
							</div>
						</div>
						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">昵称</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="add-pet-nickname"
									name="pet-nickname" value="">
							</div>
						</div>
						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">性别</label>
							<div class="col-sm-10">
								<input type="radio" name="pet-sex" checked value="雄">雄 <input
									type="radio" name="pet-sex" value="雌">雌
							</div>
						</div>
						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">种类</label>
							<div class="col-sm-10">
								<select class="add-big-category" name="pet-bigcategory"></select>
								<select class="add-small-category" name="pet-smallcategory"></select>
							</div>
						</div>

						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">介绍</label>
							<div class="col-sm-10">
								<textarea class="form-control" rows="3" id="add-pet-introduce"
									name="pet-introduce"></textarea>
							</div>
						</div>

						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">年龄</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="add-pet-age"
									name="pet-age" value="">
							</div>
						</div>
						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">体型</label>
							<div class="col-sm-10">
								<!-- 根据 -->
								<select class="shape" name="pet-shape">
									<option>大型</option>
									<option>中型</option>
									<option>小型</option>
								</select>
							</div>
						</div>

						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">体重(kg)</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" name="pet-weight"
									id="add-pet-weight" value="">
							</div>
						</div>

						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">颜色</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="add-pet-color"
									name="pet-color" value="">
							</div>
						</div>

						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">进价</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="add-pet-costprice"
									name="pet-costprice" value="">
							</div>
						</div>

						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">数量</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="add-pet-count"
									name="pet-count" value="">
							</div>
						</div>

						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">产地</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="add-pet-address"
									name="pet-address" value="">
							</div>
						</div>

						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">售价</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="add-pet-price"
									name="pet-price" value="">
							</div>
						</div>

						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">特价</label>
							<div class="col-sm-10">
								<input type="text" class="form-control"
									id="add-pet-specialprice" name="pet-specialprice" value="">
							</div>
						</div>



						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">添加时间</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" disabled="disabled"
									id="add-pet-date" name="pet-date" value="">
							</div>
						</div>


						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">是否特价</label>
							<div class="col-sm-10">
								<input type="radio" name="pet-mark" checked value="1">是
								<input type="radio" name="pet-mark" value="0">否
							</div>
						</div>

						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">是否上架</label>
							<div class="col-sm-10">
								<input type="radio" name="pet-state" checked value="1">是
								<input type="radio" name="pet-state" value="0">否
							</div>
						</div>


						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">图1</label>
							<div class="col-sm-10">

								<input type="file" name="pet-image01" class="form-control"
									id="add-pet-image01" value="">
							</div>
						</div>

						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">图2</label>
							<div class="col-sm-10">

								<input type="file" name="pet-image02" class="form-control"
									id="add-pet-image02" value="">
							</div>
						</div>

						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label">图3</label>
							<div class="col-sm-10">
								<input type="file" name="pet-image03" class="form-control"
									id="add-pet-image03" value="">
							</div>
						</div>

						<div class="form-group">
							<div class="col-sm-10">
								<input type="button" class="btn btn-lg btn-primary" id="add-btn"
									value="确定">
							</div>
						</div>

						<!-- form end -->
					</form>


					<!-- ===================================================================== -->

				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭
					</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal -->
	</div>





</body>

</html>